<template>
  <section class="container">
    <div class="add-title">
      <input placeholder="标题"/>
    </div>
    <div class="add-type-category">
      <span class="add-type">
        <span ><input name="type" type="radio"/><label>&nbsp;&nbsp;问题</label></span>
        <span><input name="type" type="radio"/><label>&nbsp;&nbsp;文章</label></span>
      </span>
      <span class="add-category">
        <select>
        <option>健康</option>
        <option>健康</option>
        <option>健康</option>
        <option>健康</option>
        <option>健康</option>
      </select>
      </span>

    </div>
    <div class="add-content">
      <textarea rows="50" placeholder="正文"></textarea>
    </div>
  </section>
</template>

<script>
  export default {
    layout: 'add',
    data () {
      return {}
    },
    mounted () {
    },
    methods: {}
  }
</script>
<style>
  .add-title>input,.add-content>textarea{
    width: 98%;
    padding: 1%;
  }
  .add-title>input{
    font-size: 1.3em;
    font-weight: 600;
    border-bottom: 1px solid #ececec!important;
  }
  .add-category>select{
    width: 100px;
    margin-left: 10px;
  }
  .add-category>select,.add-content>textarea,.add-title>input{
    border: none;
    outline: none;
    margin-bottom: 15px;
  }

  .add-content>textarea{
    height: 90%;
    font-size: 1.2em;
    border-top: 1px solid #ececec!important;
  }
  /* 手机或小平板 phone */
  @media all and (max-width: 766px) {
    .add-title>input,.add-content>textarea{
      width: 97%;
      padding: 1.5%;
    }

  }
</style>
